﻿<UserControl x:Class="ViewOn.UI.VisualModeContainer.Normal.PlayerControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:wpf="clr-namespace:ViewOnCore.Helper.WPF;assembly=ViewOnCore"
    xmlns:host="clr-namespace:ViewOnCore.HostContract;assembly=ViewOnCore"
    xmlns:properties="clr-namespace:ViewOn.Properties"
    Height="75">

    <UserControl.Resources>

        <Storyboard x:Key="previousButtonShowStoryboard">
            <Storyboard>
                <DoubleAnimation To="1" Duration="00:00:00.4000000" Storyboard.TargetName="btnPrevious" Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Storyboard>
        <Storyboard x:Key="previousButtonHideStoryboard">
            <Storyboard>
                <DoubleAnimation To="0" Duration="00:00:00.4000000" Storyboard.TargetName="btnPrevious" Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Storyboard>

        <Storyboard x:Key="nextButtonShowStoryboard">
            <Storyboard>
                <DoubleAnimation To="1" Duration="00:00:00.4000000" Storyboard.TargetName="btnNext" Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Storyboard>
        <Storyboard x:Key="nextButtonHideStoryboard">
            <Storyboard>
                <DoubleAnimation To="0" Duration="00:00:00.4000000" Storyboard.TargetName="btnNext" Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Storyboard>

        <Storyboard x:Key="playButtonShowStoryboard">
            <Storyboard>
                <DoubleAnimation To="1" Duration="00:00:00.4000000" Storyboard.TargetName="btnPlay" Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Storyboard>
        <Storyboard x:Key="playButtonHideStoryboard">
            <Storyboard>
                <DoubleAnimation To="0" Duration="00:00:00.4000000" Storyboard.TargetName="btnPlay" Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Storyboard>

    </UserControl.Resources>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>

        <!-- Central zone -->
        <Grid HorizontalAlignment="Center" Height="65" MinWidth="300">
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition Width="30"/>
            </Grid.ColumnDefinitions>

            <Grid Margin="5,5,5,5">
                <Grid x:Name="griInformations">
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <TextBlock x:Name="txtTitle" HorizontalAlignment="Stretch" Margin="2,2,2,2" Text="-" TextAlignment="Center" FontSize="14" FontFamily="Arial Rounded MT">
            <TextBlock.BitmapEffect>
              <OuterGlowBitmapEffect GlowColor="{Binding Source={x:Static host:Host.UIService}, Path=GlowColors.VOGColor1A}" GlowSize="3" Noise="0" Opacity="0.5" />
            </TextBlock.BitmapEffect>
                    </TextBlock>
                    <Grid Grid.Row="1">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="85"/>
                        </Grid.ColumnDefinitions>
                        <Slider x:Name="sliPosition" Style="{StaticResource Slider.PositionWithEffect4}" ValueChanged="PositionChanged" HorizontalAlignment="Stretch" Margin="5,0,5,0" VerticalAlignment="Center" Maximum="100" LargeChange="10"/>
                        <TextBlock x:Name="txtDuration" Grid.Column="1" HorizontalAlignment="Right" Margin="5,0,5,0" Text="-" TextAlignment="Center" Width="75" FontSize="12">
              <TextBlock.BitmapEffect>
                <OuterGlowBitmapEffect GlowColor="{Binding Source={x:Static host:Host.UIService}, Path=GlowColors.VOGColor1A}" GlowSize="3" Noise="0" Opacity="0.5" />
              </TextBlock.BitmapEffect>
                        </TextBlock>
                    </Grid>
                </Grid>
                <TextBlock x:Name="txtTitle2" HorizontalAlignment="Center" Margin="2,2,2,2" Foreground="{DynamicResource VOColorText}" Text="-" TextAlignment="Center" Visibility="Hidden" VerticalAlignment="Top">
          <TextBlock.BitmapEffect>
            <OuterGlowBitmapEffect GlowColor="{Binding Source={x:Static host:Host.UIService}, Path=GlowColors.VOGColor10}" GlowSize="2" Noise="0" Opacity="0.5" />
          </TextBlock.BitmapEffect>
                </TextBlock>
            </Grid>

            <wpf:Spinner x:Name="spiRadio" Width="50" Height="50" RenderTransformOrigin="0.5,0.5" Margin="0,15,0,0">
                <wpf:Spinner.RenderTransform>
                    <TransformGroup>
                        <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
                        <SkewTransform AngleX="0" AngleY="0"/>
                        <RotateTransform Angle="0"/>
                        <TranslateTransform X="0" Y="0"/>
                    </TransformGroup>
                </wpf:Spinner.RenderTransform>
            </wpf:Spinner>

            <Grid Grid.Column="1">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <ToggleButton x:Name="btnShuffle" Grid.Row="1" Style="{StaticResource ToggleButton.WithEffect}" Click="btnShuffle_Click" ToolTip="{x:Static properties:Globalization.PlayerBar_Shuffle}" HorizontalAlignment="Center" VerticalAlignment="Center">
                    <wpf:Icon Source="/_images/Player/shuffle.png" Width="12" Height="12" Margin="1,1,1,1"/>
                </ToggleButton>
                <ToggleButton x:Name="btnRepeat" Style="{StaticResource ToggleButton.WithEffect}" Click="btnRepeat_Click" ToolTip="{x:Static properties:Globalization.PlayerBar_Repeat}" HorizontalAlignment="Center" VerticalAlignment="Center">
                    <wpf:Icon Source="/_images/Player/repeat.png" Width="12" Height="12" Margin="1,1,1,1"/>
                </ToggleButton>
                <Button x:Name="btnEqualizer" Grid.Row="2" Click="btnEqualizer_Click" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{DynamicResource Button.TransparentWithEffect}">
                    <wpf:Icon Source="/_images/Player/equalizer.png" Width="12" Height="12" Margin="1,1,1,1"/>
                </Button>
            </Grid>
        </Grid>

        <!-- Right zone -->
        <Grid HorizontalAlignment="Right" Grid.Column="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="130"/>
                <ColumnDefinition Width="140"/>
            </Grid.ColumnDefinitions>

            <StackPanel>
                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" x:Name="staButtonsUp">
                    <Button x:Name="btnPrevious" Style="{DynamicResource Button.TransparentWithEffect3}" Margin="0,0,4,0" Width="15" Height="15" Click="btnPrevious_Click">
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                            <Path
                  Width="6"
                  Height="11"
                  Data="M60,100 L60,0 0,50 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                            <Path
                  Width="6"
                  Height="11"
                  Data="M60,100 L60,0 0,50 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                        </StackPanel>
                    </Button>
                    <Button x:Name="btnPlay" Style="{DynamicResource Button.TransparentWithEffect3}" Margin="4,0,4,0" Width="20" Height="20" Grid.Column="1" Click="btnPlay_Click">
                        <Grid>
                            <Path
                  x:Name="patPlay"
                  HorizontalAlignment="Center"
                  Width="10"
                  Height="17"
                  Data="M0,100 L0,0 60,50 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                            <StackPanel x:Name="patPause" Visibility="Collapsed" Orientation="Horizontal" HorizontalAlignment="Center">
                                <Path
                  Width="4"
                  Height="17"
                  Data="M0,0 20,0 20,100 0,100 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                                <Path
                  Margin="2,0,0,0"
                  Width="4"
                  Height="17"
                  Data="M0,0 20,0 20,100 0,100 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                            </StackPanel>
                        </Grid>
                    </Button>
                    <Button x:Name="btnNext" Style="{DynamicResource Button.TransparentWithEffect3}" Margin="4,0,4,0" Width="15" Height="15" Grid.Column="2" Click="btnNext_Click">
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                            <Path
                  Width="6"
                  Height="11"
                  Data="M0,100 L0,0 60,50 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                            <Path
                  Width="6"
                  Height="11"
                  Data="M0,100 L0,0 60,50 z"
                  Stretch="Fill"
                  Fill="{DynamicResource VOGradient01}"
                  Stroke="{DynamicResource VOGradient02}"/>
                        </StackPanel>
                    </Button>
                </StackPanel>
                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" x:Name="staButtonsDown">
                    <Button Style="{DynamicResource Button.TransparentWithEffect3}" Margin="2,0,2,0" Width="15" Height="15" Grid.Column="0" Click="btnMute_Click" Grid.Row="1">
                        <Grid>
                            <StackPanel x:Name="patMuteOn" Orientation="Horizontal" HorizontalAlignment="Center">
                                <Path
                Width="2"
                Height="6"
                Data="M0,40 0,60"
                Stretch="Fill"
                VerticalAlignment="Center"
                Fill="{DynamicResource VOGradient01}"
                Stroke="{DynamicResource VOGradient02}"/>
                                <Path
                Margin="1,0,0,0"
                Width="4"
                Height="14"
                Data="M20,35 80,0 80,100 20,65 z"
                Stretch="Fill"
                VerticalAlignment="Center"
                Fill="{DynamicResource VOGradient01}"
                Stroke="{DynamicResource VOGradient02}"
                />
                            </StackPanel>
                            <StackPanel x:Name="patMuteOff" Orientation="Horizontal" HorizontalAlignment="Center" Visibility="Collapsed">
                                <Path
                Width="2"
                Height="6"
                Data="M0,40 0,60"
                Stretch="Fill"
                VerticalAlignment="Center"
                Fill="{DynamicResource VOGradient01}"
                Stroke="{DynamicResource VOGradient02}"/>
                                <Path
                Margin="1,0,0,0"
                Width="4"
                Height="14"
                Data="M20,35 80,0 80,100 20,65 z"
                Stretch="Fill"
                VerticalAlignment="Center"
                Fill="{DynamicResource VOGradient01}"
                Stroke="{DynamicResource VOGradient02}"
                />
                                <Canvas Width="6" Height ="6" VerticalAlignment="Center" Margin="1,0,0,0">
                                    <Line X1="0" Y1="0" X2="6" Y2="6" Stroke="{DynamicResource VOGradient02}"/>
                                    <Line X1="0" Y1="6" X2="6" Y2="0" Stroke="{DynamicResource VOGradient02}"/>
                                </Canvas>
                            </StackPanel>
                        </Grid>
                    </Button>
                    <Slider x:Name="slider" Style="{DynamicResource Slider.VolumeWithEffect3}" ValueChanged="VolumeChanged" HorizontalAlignment="Stretch" Margin="2,0,0,0" VerticalAlignment="Stretch" Maximum="100" LargeChange="10" Width="80"/>
                </StackPanel>
            </StackPanel>

            <StackPanel Grid.Column="1" VerticalAlignment="Stretch" Margin="5,5,5,5" Width="100">
                <Image x:Name="SpectrumImage" Width="100" Height="26" Stretch="Fill"/>
                <Image x:Name="SpectrumImageReflection" Width="100" Height="12" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                    <Image.OpacityMask>
                        <LinearGradientBrush EndPoint="0.471,-0.07" StartPoint="0.471,1.057">
                            <GradientStop Color="#7FFFFFFF" Offset="0" />
                            <GradientStop Color="#00FFFFFF" Offset="1" />
                        </LinearGradientBrush>
                    </Image.OpacityMask>
                    <Image.RenderTransform>
                        <TransformGroup>
                            <ScaleTransform ScaleX="1" ScaleY="-1" />
                            <SkewTransform AngleX="0" AngleY="0" />
                            <RotateTransform Angle="0" />
                            <TranslateTransform X="0" Y="0" />
                        </TransformGroup>
                    </Image.RenderTransform>
                </Image>
            </StackPanel>

            <Border Grid.Column="1" x:Name="borSpectrumHighlight" MouseUp="spectrum_MouseUp"  Margin="3,3,3,3" CornerRadius="1" BorderThickness="1" Opacity="0" BorderBrush="#FF41403E">
                <Border.Background>
                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                        <GradientStop Color="#BF31302F" Offset="0.12"/>
                        <GradientStop Color="#BF201913" Offset="0.544"/>
                        <GradientStop Color="#BF313130" Offset="0.94"/>
                        <GradientStop Color="#BF100E0D" Offset="0.524"/>
                    </LinearGradientBrush>
                </Border.Background>
                <Border.BitmapEffect>
                    <OuterGlowBitmapEffect GlowColor="{Binding Source={x:Static host:Host.UIService}, Path=GlowColors.VOGColor1A}" GlowSize="3" Noise="0" Opacity="0.5" />
                </Border.BitmapEffect>
                <Border.Triggers>
                    <EventTrigger RoutedEvent="Mouse.MouseEnter">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation To="0.7" Duration="00:00:00.2000000" Storyboard.TargetProperty="Opacity" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Mouse.MouseLeave">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation To="0" Duration="00:00:00.2000000" Storyboard.TargetProperty="Opacity" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Border.Triggers>
            </Border>
        </Grid>

    </Grid>
</UserControl>
